<template>
  <div>
    <div class="page-wrap">
      <div class="page-main">
        <div class="page-top-bg">
          <div class="page-logo"></div>
          <div class="page-time">{{ currentDate }}</div>
        </div>
        <div class="page-item" v-for="(item, index) in page" :key="index">
          <div v-if="item.path == 'page1'">
            <page1></page1>
          </div>
          <div v-if="item.path == 'page2'">
            <page2></page2>
          </div>
          <div v-if="item.path == 'page3'">
            <page3></page3>
          </div>
          <div v-if="item.path == 'page4'">
            <page4></page4>
          </div>
          <div v-if="item.path == 'page5'">
            <page5></page5>
          </div>
          <div v-if="item.path == 'page6'">
            <page6></page6>
          </div>
          <div v-if="item.path == 'page7'">
            <page7></page7>
          </div>
          <div v-if="item.path == 'page8'">
            <page8></page8>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import page1 from "./page1";
import page2 from "./page2";
import page3 from "./page3";
import page4 from "./page4";
import page5 from "./page5";
import page6 from "./page6";
import page7 from "./page7";
import page8 from "./page8";
export default {
  data() {
    return {
      page: [
        { path: "page1" },
        { path: "page2" },
        { path: "page3" },
        { path: "page4" },
        { path: "page5" },
        { path: "page6" },
        { path: "page7" },
        { path: "page8" },
      ],
      currentDate: this.$dayjs().format("YYYY年MM月DD日 HH:mm:ss"),
      mainMenu: [],
      intervalId: null,
    };
  },
  mounted() {
    this.intervalId = setInterval(() => {
      this.currentDate = this.$dayjs().format("YYYY年MM月DD日 HH:mm:ss");
    }, 1000);
  },
  destroyed() {
    clearInterval(this.intervalId)
  },
  components: {
    page1,
    page2,
    page3,
    page4,
    page5,
    page6,
    page7,
    page8,
  },
};
</script>
<style lang="scss" scoped>
@import url(../assets/css/base.css);
</style>
